<template>
  <div>
    <el-page-header @back="goBack" content="退款信息"></el-page-header>
    <div v-if="showTable">
    <table border="1" style="margin-left: 75px;margin-top: 30px;">
      <tr>
        <th style="width: 100px;text-align: center">对外业务编号:</th>
        <td style="width: 200px;">{{refundInfo.outTradeNo}}</td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">订单id:</th>
        <td style="width: 200px;">{{refundInfo.orderId}}</td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">支付类型:</th>
        <td style="width: 200px;">
          <span v-if="refundInfo.paymentType==0">微信支付</span>
          <span v-if="refundInfo.paymentType==1">支付宝支付</span>
        </td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">交易编号:</th>
        <td style="width: 200px;">{{refundInfo.tradeNo}}</td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">支付金额:</th>
        <td style="width: 200px;">{{refundInfo.totalAmount}}</td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">交易内容:</th>
        <td style="width: 200px;">{{refundInfo.subject}}</td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">支付状态:</th>
        <td style="width: 200px;">
          <span v-if="refundInfo.paymentStatus==0">未支付</span>
          <span v-if="refundInfo.paymentStatus==1">已支付</span>
        </td>
      </tr>
      <tr>
        <th style="width: 100px;text-align: center">创建时间:</th>
        <td style="width: 200px;">{{refundInfo.createTime}}</td>
      </tr>

    </table>
    </div>
    <div v-if="!showTable">
      <h1>改订单暂未退款</h1>
    </div>
  </div>
</template>

<script>
import refundInfoApi from "@/api/order/refundInfo"

export default {
  data() {
    return {
      orderId:this.$route.params.id,
      refundInfo:null,
      showTable:true
    }
  },
  created() {
    refundInfoApi.querRefundInfoByOrderId(this.orderId).then(response=>{
      console.log("返回数据",response.data)
      this.refundInfo=response.data
      if (this.refundInfo==null){
        this.showTable=false
      }
    }).catch(error => {
      console.log(error)
    })
  },
  methods: {
    goBack() {
      this.$router.push({path: "/order/orderInfo"})
    }
  }
}
</script>

<style scoped>

</style>
